<template>
  <view class="payment-container"> 
	<view class="hotel-title">支付订单</view>
    <!-- payment status -->
    <view class="product-card">
	  <img class="successImg" src="http://img.jowong.com/aba/2025-03-28/success_1743140692419.png" alt="">
	  <view>
	  	<view class="payment-success">支付成功！</view>
		<view class="thanks">感谢您的购买</view>
	  </view> 
    </view>
	
	<img class="other-img" src="http://img.jowong.com/aba/2025-03-28/pic1_1743145797021.png" alt="">
	<img class="other-img" src="http://img.jowong.com/aba/2025-03-28/pic2_1743145566955.png" alt="">
    

    <!-- Payment Button -->
    <view class="payment-btn-container">
      <button class="payment-btn" @click="handlePayment">查看订单</button>
      <button class="payment-btn" @click="handlePayment">返回首页</button>
    </view>
  </view>
</template>

<script lang="ts" setup>  
const handlePayment = () => {
	uni.reLaunch({
		url:"/pages/index/index"
	})
}

</script>

<style scoped>
.payment-container {
  background: linear-gradient(to bottom, #CFDDD4 5%, #FFFFFF 15%);
  padding: 20rpx;
  min-height: 100vh;
  background-color: #f5f5f5;
}

.hotel-title{  
	height: 62rpx;
	width: 100%; 
	padding:12% 0 30rpx 0;
	align-items: center;
	text-align: center;
} 
.product-card {
  margin-bottom: 200rpx; 
  display: flex;
  align-items: center; 
  justify-content: center;
}
.successImg{
	height: 75rpx;
	width: 75rpx;
	margin-right: 30rpx;
}
.payment-success{
	font-family: PingFang SC;
	font-weight: 800;
	font-size: 42rpx;
	color: #333333;
	margin-top: -5rpx;
	
}
.thanks{
	font-family: PingFang SC;
	font-weight: 800;
	font-size: 22rpx;
	color: #777777;
}
.other-img{
	height: 245rpx;
    margin-bottom: 20rpx; 
	border-radius: 10rpx;
	width: 100%;
}
.payment-btn-container {
  margin-top: 160rpx;
  display: flex;
  justify-content: space-between;
}

.payment-btn {
	width: 46%;
	height: 92rpx;
	font-family: PingFang SC;
	font-weight: bold;
	font-size: 33rpx;
	color: #1B9C61; 
	background: #fff;
	border-radius: 10rpx;
	line-height: 90rpx;
	border:1rpx solid #1B9C61;
} 
</style>